<jsp:useBean id="userInfo" scope="session" type="cn.hx.entity.UserInfo"/>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>西藏欢迎你</title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/index.css">
    <script src="${pageContext.request.contextPath}/js/jquery-3.6.0.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
    <style>
        #checkOfPassword, #checkOfTelephone, #checkOfEmail, #checkOfIdCard {
            color: red;
            display: none;
            font-weight: bold;
        }
    </style>
</head>
<body>
<div class="header">
    <%@include file="../pub/header.jsp" %>
    <div class="nav">
        <div class="container">

            <div class="row">
                <a class="col-md-3 col-xs-6" href="${pageContext.request.contextPath}/index">首&nbsp;页</a>
                <a class="col-md-3 col-xs-6" href="${pageContext.request.contextPath}/user/news">新闻资讯</a>
                <a class="col-md-3 col-xs-6" href="${pageContext.request.contextPath}/re_approve/item">办事大厅</a>
                <a class="col-md-3 col-xs-6"
                   href="${pageContext.request.contextPath}/item/revealFull">公示信息</a>
            </div>
        </div>
    </div>
</div>
<div class="container" align="center">
    <br>
    <div  class="jbxx">我的基本信息</div>
    <%--<a href="#" class="xmxx" onclick="f2()">项目信息</a>--%>
</div>
<%--<%@include file="../pub/header.jsp" %>--%>
<%--<h1 align="center" style="color: #0b7ec4">个人信息</h1>--%>
<br>
<form class="col-lg-offset-3 col-md-offset-3 col-sm-offset-3 col-xs-offset-3" style="width: 50%" method="post"
      action="${pageContext.request.contextPath}/user/modify/update">
    <input type="password" name="id" value="${userInfo.id}" hidden readonly>
    <div class="form-group">
        <label for="name">用户名</label>
        <input type="text" class="form-control" id="name" name="name" value="${userInfo.name}" minlength="1"
               maxlength="12" required>
    </div>
<%--    <div class="form-group">--%>
<%--        <label for="password">密码</label>--%>
<%--        <input type="password" class="form-control" id="password" name="password" value="${userInfo.password}"--%>
<%--               minlength="6" maxlength="12" placeholder="字母、数字、下划线" required>--%>
<%--        <p id="checkOfPassword" class="condition"><br>格式错误</p>--%>
<%--    </div>--%>
    <div class="form-group">
        <label for="telephone">电话</label>
        <input type="tel" class="form-control" id="telephone" name="telephone" value="${userInfo.telephone}"
               minlength="11"
               maxlength="11" required>
        <p id="checkOfTelephone" class="condition"><br>格式错误</p>
    </div>
    <div class="form-group">
        <label for="email">邮箱</label>
        <input type="email" class="form-control" id="email" name="email" value="${userInfo.email}" minlength="6"
               maxlength="24" required>
        <p id="checkOfEmail" class="condition"><br>格式错误</p>
    </div>
    <div class="form-group">
        <label for="idCard">身份证</label>
        <input type="text" class="form-control" id="idCard" name="idCard" value="${userInfo.idCard}" minlength="18"
               maxlength="18" required>
        <p id="checkOfIdCard" class="condition"><br>格式错误</p>
    </div>
    <div class="form-group">
        <label for="sex">性别</label>&emsp;&emsp;
        <select id="sex" name="sex" class="form-control">
            <option id="man">男</option>
            <option id="woman">女</option>
        </select>
    </div>
    <div class="form-group">
        <label for="address">地址</label>
        <input type="text" class="form-control" id="address" name="address" value="${userInfo.address}" minlength="6"
               maxlength="40" required>
    </div>
    <br>
    <div align="center">
        <button type="submit" class="btn-lg btn-primary">保存</button>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
        <button type="button" class="btn-lg btn-info" onclick="window.location.href=document.referrer">返回</button>
    </div>
</form>
<%@include file="../pub/footer.jsp" %>
</body>
<script>
    $('#password').change(function () {
        $('#checkOfPassword').css('display', /^\w{6,12}$/.test(this.value) ? 'none' : 'block');
    })
    $('#telephone').change(function () {
        $('#checkOfTelephone').css('display', /^1[1-9]\d{9}$/.test(this.value) ? 'none' : 'block');
    })
    $('#email').change(function () {
        $('#checkOfEmail').css('display', /^\w+@\w+\.[a-zA-Z]+$/.test(this.value) ? 'none' : 'block');
    })
    $('#idCard').change(function () {
        $('#checkOfIdCard').css('display', /^[2-8]\d{5}(19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9X]$/.test(this.value) ? 'none' : 'block');
    })
    $('form').submit(function (event) {
        $('.condition').each(function () {
            if ($(this).css('display') === 'block')
                event.preventDefault();
        })
    })
    $(function () {
        ${userInfo.sex.equals("男")}
            ? $("#man").prop("selected", "selected") : $("#woman").prop("selected", "selected");
    })
</script>
</html>